<template>
    <div class="btn" @click="showMsg">{{ msg }}</div>
</template>

<script setup lang="ts">

const props = defineProps<{
    msg?:string
}>()

const emits = defineEmits<{
    (e:'confirm',msg:string):void
}>()

const showMsg = () =>{
    emits('confirm',props.msg??'')
}

</script>

<style scoped>

.btn{
    margin: 8px;
    padding: 4px 8px;
    border-radius: 50%;
    background-color: rosybrown;
}

</style>